<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <link rel="stylesheet" type="text/css" href="__CSS__/lib/normalize.css" />
    <link rel="stylesheet" type="text/css" href="__CSS__/mui-3.6.1.min.css" />
    <link rel="stylesheet" type="text/css" href="__CSS__/search-two.css" />
    <link rel="stylesheet" href="__CSS__/my_pullrefresh.css" type="text/css">
    <title>商品搜索</title>
</head>

<body>
    <div class="mui-content">
        <div class="top-bar mui-row">
            <div class="return mui-col-sm-2 mui-col-xs-2" onclick="location.href='/Wx/Search/searchF'"></div>
            <div class="top-middle mui-col-sm-8 mui-col-xs-8">
                <div class="s-top-middle">
                    <input type="search" value="{$keyword}" placeholder="" id="serachValue"/>
                </div>
            </div>
            <div id="search"  class="top-right mui-col-sm-2 mui-col-xs-2">搜索</div>
        </div>
    </div>
    <div id="no-goods" style="display:none">
        <div class="my-box">
            <img src="__IMG__/search/box.png"/>
        </div>
        <div class="b-no-cnt">
            <p>抱歉！ 没有找到与 "<span class="no-cnt">没有符合</span>" 店铺或商品</p>
            <p>你可以尝试更换关键词继续搜索</p>
        </div>
    </div>

    <div id="slider" class="mui-slider mui-fullscreen" style="top: 47px!important">
        <div class="mui-slider-group">
            <div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
                <div class="mui-scroll-wrapper">
                    <div class="mui-scroll">
                        <ul class="mui-table-view" id="view">
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>




<script type="text/javascript" src="__JS__/jquery2.1.1.min.js"></script>
<script type="text/javascript" src="__JS__/mui.js"></script>
<script src="__JS__/mui.pullToRefresh.js"></script>
<script src="__JS__/mui.pullToRefresh.material.js"></script>
<script type="text/javascript" src="__JS__/search-two.js"></script>
<script type="text/javascript" src="__JS__/search_pullrefresh.js"></script>
<script type="text/javascript" src="__JS__/jquery.cookie.js"></script>
<script type="text/javascript">

 var longitude=0, latitude=0;
 <if condition="$lat">
 longitude = {$lon};
 latitude = {$lat};
 getShops();
 </if>

function getShops(){
  var data={
        lat: latitude,
        lon: longitude,
        keyGoods: $('#serachValue').val()
    };
  $.getJSON('/Wx/Search/getGoods',data,function(data){
    var html='';
    if(data){
       $.each(data,function(i,n){
        var score = Math.floor(n['score']);

          html+='  <a class="mui-table-view-cell mui-table-view-cell-2" href="/Wx/Shop/shop?id='+n['shopId']+'">';

          html+='    <div class="mui-content-2">';
          html+='          <div class="gg  mui-col-xs-3">';
          html+='              <div class="ufo-2" style="background-image:url(\'/'+n['shopImg']+'\')"></div>';
          html+='          </div>';
          html+='          <div class="gg mui-col-sm-6 mui-col-xs-6">';
          html+='               <div class="yzg">'+n['shopName']+'</div>';
          html+='               <div class="star">';
          for(var i=1;i<=5;i++){
              if(i<=score){
                  html+='<img src="__IMG__/icon_star_1@2x.png" width="100%" height="100%">';
              }else if(n['score']*1+0.5>=i){
                  html+='<img src="__IMG__/icon_star_05@2x.png" width="100%" height="100%">';
              }else{
                  html+='<img src="__IMG__/icon_star_0@2x.png" width="100%" height="100%">';

              }
          }
          html+='                   <span>'+(n['score'])+'</span>月售'+n['yue_xiaoliang']+'份';
          html+='               </div>';
          html+='               <div class="y-time">预计送达时间: <span>'+n['deliveryCostTime']+'</span>分钟 / '+n['juli2']+'</div>';
          html+='               <div class="b-you">';
          html+='                   <img src="__IMG__/icon_baoyou@2x.png"/>满'+n['deliveryFreeMoney']+'包邮';
          html+='               </div>';
          html+='          </div>';
          html+='          <div class="gg mui-col-sm-2 mui-col-xs-2">';
          html+='              <p class="qsf"><span class="q-sf">'+n['deliveryStartMoney']+'</span>元起送</p>';
          html+='              <p class="psf"><span>'+n['deliveryMoney']+'</span>元配送费</p>';
          html+='          </div>';
          html+='      </div>';
          html+='      <div class="gg-btm">';
          html+='          <ul>';
          if(n['goodsList']){
            $.each(n['goodsList'],function(j,k){
               html+='              <li data-id="'+k['goodsId']+'">';
                html+='                  <div class="gg-btm-yzg" style="background-image:url(/'+k['goodsThums']+')"></div>';
                html+='                  <div class="gg-btm-yzgf">'+k['goodsName']+'</div>';
                html+='                  <div class="gg-btm-yzgq">¥'+k['shopPrice']+'</div>';
                html+='              </li>';
            })
          }
          html+='          </ul>';
          html+='      </div>';
          html+='  </a>';
      })
      $('#no-goods').hide();
      $('#view').html(html);

     }else{
      $('#view').html('');
        $('#no-goods').show();
     }

  })
}

$('#search').click(function(){
  getShops();
})

</script>
<if condition="$load == 1">
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=BLLEya4O2uCtPVA9WWtD6tCUyyYRThrN"></script>
<script type="text/javascript" src="/Tpl/wx/js/convertor.js"></script>
<script type="text/javascript" src="__JS__/baiduMap.js"></script>
</if>
</body>

</html>
